 .sp-register {

	 &__ {

		// 注册须知
		&rule {
			padding: 30rpx 30rpx 200rpx;

			&- {

				&main {

					& > label {
						display: block;
						.font(30, 42, #222, left);
						margin-bottom: 20rpx;
					}

					text {
						display: block;
						margin-bottom: 20rpx;
						.font(30, 42, #666, left)
					}

					.sp-register__rule-dange {
						color: #FF5F5F;
					}
				}

				&footer {
					position: fixed;
					left: 0;
					bottom: 0;
					.size(750, 200);
					.back-color(#fff);
					.shadow(0px 0px 26rpx 0px rgba(0,0,0,0.06));
				}

				&check {
					.flex();
					height: 80rpx;
					padding: 0 36rpx;

					label,
					text {
						display: block;
					}

					label {
						.square(30);
						margin-right: 10rpx;
						background: url('@{cdn}register/radio.png') center no-repeat;
						background-size: cover;
					}
					label.checked {
						background: url('@{cdn}user/checked.png') center no-repeat;
						background-size: cover;
					}
					text {
						.font(24, 30, #666, left);
					}


				}

				&control {
					.flex();
					height: 120rpx;
					justify-content: space-between;
					padding: 0 60rpx;
				}

				&small {

					.sp-button {
						// display: block;
						width: 630rpx;
					}
				}
			}
		}

		// 挂号 选择时间、一声
		&change {

			&- {

				&date {
					height: 198rpx;
					.back-color(#EFF5FF);
					margin-bottom: 6rpx;
					padding: 24rpx 0;
					.boxing();

					.u-tabs {
						// padding: 0 24rpx;
						width: 702rpx;
						margin: 0 auto;
					}

					.u-tabs__time-tabs {
						width: 130rpx;
						height: 150rpx !important;
						background: #FFFFFF;
						border-radius: 20rpx;
						.boxing();

						&:not(:first-child) {
							margin-left: 8rpx;
						}
					}
					.u-tabs__time-tabs-active {
						color: #fff !important;
						background: linear-gradient(135deg, #8EBDFF 0%, #6582F9 100%);
						box-shadow: 0px 10px 10px -6px rgba(101,130,249,0.5);
					}

					.u-tabs__time-bars {

						label {
							display: block;
							margin-bottom: 20rpx;
							.font(20, 20, #222);
						}

						text {
							.font(24, 40, #222);

							text {
								font-size: 30rpx;
								font-weight: bold;
							}
						}
					}

					.u-tabs__time-tabs-active .u-tabs__time-bars {

						label {
							color: #fff;
						}

						text {
							color: #fff;
						}
					}
				}

				&main {
					padding: 0 24rpx;
				}

				&title {
					.flex();
					height: 88rpx;
					padding-left: 42rpx;
					.font(28, 40, #FFB91E);
				}

				&day {
					background: url('@{cdn}register/day.png') left 26rpx no-repeat;
					background-size: 34rpx;
				}

				&night {
					background: url('@{cdn}register/night.png') left 26rpx no-repeat;
					background-size: 34rpx;
					color: #FF631E;
				}

				&item {
					.flex();
					height: 116rpx;
					padding: 0 24rpx;
					.back-color(#fff);

					&:not(:first-child) {
						margin-top: 24rpx;
					}
				}

				&info {
					.flex();
					flex: 1;

					label,
					text {
						display: block;
					}

					label {
						.font(32, 46, #222);
						margin-right: 24rpx;
					}

					text {
						font-size: 20rpx;
						color: #bbb;
						background: #F6F6F6;
						padding: 8rpx;
					}
				}

				&btns {

					.sp-button {
						.circle(120, 60, 10rpx);
						.font(26, 60, #fff);
					}
				}
			}
		}

		// 确认订单
		&confirm {
			padding-top: 24rpx;

			&- {

				&result {
					min-height: 498rpx;
					width: 702rpx;
					margin: 0 auto;
					.radius(20);
					overflow: hidden;
				}

				&head {
					height: 144rpx;
					padding: 28rpx 24rpx 0;
					.boxing();
					border-bottom: 1rpx solid #eee;
					background: linear-gradient(180deg, #EFF2FE 0%, rgba(239,242,254,0) 100%);

					& > {

						label {
							display: block;
							.font(24, 32, #666, left);
							margin-bottom: 10rpx;
						}

						text {
							.font(36, 50, #6582F9, left);

							text {
								font-size: 28rpx;
								padding-left: 16rpx;
							}
						}
					}
				}

				&body {
					padding: 24rpx 24rpx 0;
				}

				&item {
					.flex();
					margin-top: 24rpx;

					label,
					text {
						display: block;
					}

					label {
						width: 175rpx;
						.font(28, 40, #666, left);
					}

					text {
						.font(28, 40, #222, left);
					}
				}
			}
		}

		// 退号
		&return {
			padding: 24rpx 24rpx 120rpx;

			.sp-register__rule-footer {
				height: 120rpx;
			}

			&- {

				&doctor {
					.size(702, 234);
					margin: 0 auto;
					border-top: 10rpx solid #6582F9;
					border-radius: 20rpx;
					overflow: hidden;
					padding: 35rpx 24rpx 0;
					.back-color(#fff);
					.boxing();

					&-info {
						.flex();

						label,
						text {
							display: block
						}

						label {
							.font(28, 40, #222);
						}

						text {
							padding-left: 20rpx;
							.font(24, 40, #666);
						}
					}

					& > text {
						display: block;
						margin-top: 24rpx;
						.font(28, 40, #222, left);
					}
				}

				&list {
					.radius(20);
					overflow: hidden;
					.back-color(#fff);
					margin-top: 24rpx;
				}

				&item {
					.flex();
					justify-content: space-between;
					height: 100rpx;
					.boxing();
					padding: 0 24rpx;

					&:nth-child(1) {
						border-bottom: 1rpx solid #eee;
					}

					label,
					text{
						.font(28, 40, #222);
					}
				}

				&arrow {
					padding-right: 54rpx;
					background: url('@{cdn}member/arrow.png') right no-repeat;
					background-size: 30rpx;
				}
			}
		}

		// 挂号失败
		&fail {
			padding: 160rpx 24rpx 0;

			&- {

				&icon {

					image,
					text {
						display: block;
					}

					image {
						.square(160);
						margin: 0 auto;
					}

					text {
						.font(42, 60, #FF5F5F);
						margin-top: 40rpx;
					}
				}

				&control {
					padding: 100rpx 46rpx 0;
				}

				&tips {
					margin-top: 10rpx;
					.font(28, 40, #666, center);
				}
			}
		}

		//订单中心
		&order{
			&__{
				&tabs{
					position: absolute;
					width: 750rpx;
					top: 0;
					left: 0;
					background: #fff;
				}

				&list{
					padding: 86rpx 24rpx 0;
					background: #efefef;
					&-{
						&item{
							.radius(20);
							padding: 0 24rpx 8rpx;
							background: #fff;
							margin-top: 24rpx;

							&-{
								&header{
									.f-center-space();
									height: 82rpx;
									font-size: 30rpx;
									font-weight: bold;
									border-bottom: 1px solid #efefef;

									label{
										color: #333;
									}
									text{
										color: #FF811E;
									}

								}
								&bodyer{
									padding-top: 16rpx;
									font-size: 28rpx;

									view{
										margin-bottom: 16rpx;
									}
								}
							}
						}
					}

				}

				&notice {
					.flex();
					.circle(702, 70, 24rpx);
					margin-top: 28rpx;
					.boxing();
					padding: 0 64rpx 0 24rpx;
					background-color: #fff;

					label {
						.font(26, 38, #FF5F5F, left);
						padding-left: 43rpx;
						background: url('@{cdn}cost/error.png') left center no-repeat;
						background-size: 36rpx;
					}

					text {
						flex: 1;
						flex-shrink: 1;
						flex-grow: 1;
						padding-left: 20rpx;
						.font(26, 38, #666, left);
					}
				}
			}
		}
	}
}

// 预创建订单
.sp-confirm {
	position: relative;
	padding: 0 24rpx;

	&__ {

		&back {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 344rpx;
			background: linear-gradient(180deg, #CEEED6 0%, rgba(206,238,214,0) 100%);
		}

		&desc,
		&content {
			position: relative;
			z-index: 11;
			.back-color(#fff);
			.radius(20);
			margin-bottom: 24rpx
		}

		&desc {
			padding: 24rpx 24rpx 12rpx;

			&- {

				&item {
					.f-center-space();
					margin-bottom: 12rpx;

					label,
					text {
						display: block;
					}

					label {
						.font(28, 40, #666, left);
					}

					text {
						.font(28, 40, #222, right);
					}
				}
			}
		}

		&content {
			padding: 0 24rpx 24rpx;

			label,
			text {
				display: block;
			}

			label {
				height: 100rpx;
				.font(32, 100, #222, left);
			}

			text {
				.font(28, 40, #666, left);
			}
		}

		&cancel {
			display: block;
			width: 610rpx;
			height: 80rpx;
			border-radius: 43rpx;
			border: 1rpx solid #DDDDDD;
			.font(32, 78, #222);
			margin: 100rpx auto;
		}
	}
}

// 支付
.sp-pay {

	&__ {

		&header {
			.back-color(#fff);
			padding: 120rpx 0 60rpx;

			& > label {
				display: block;
				.font(28, 40, #666);
				margin-bottom: 10rpx;
			}

			&- {

				&nums {
					.font(60, 84, #FF811E, center);
					margin-bottom: 60rpx;

					text {
						font-size: 32rpx;
						line-height: 45rpx;
					}
				}

				&time {
					.flex();
					justify-content: center;
					.font(28, 40, #666);

					.u-count-down__text {
						line-height: 1 !important;
						color: #6582F9 !important;
						font-size: 32rpx !important;
					}

					& > view {
						.flex();
						margin: 0 10rpx;
						background: #EFF2FE;
						padding: 0 15rpx;
						height: 60rpx;
						.radius(8);
					}
				}
			}
		}

		&title {
			padding: 46rpx 24rpx 24rpx;
			.font(30, 42, #222, left);
		}

		&submit {
			padding: 100rpx 70rpx 0;
		}

		&type {
			width: 702rpx;
			margin: 0 auto;
			padding: 0 24rpx;
			.back-color(#fff);
			.boxing();

			&- {

				&item {
					.flex();
					position: relative;
					height: 100rpx;
					background: url('@{cdn}register/check.png') 600rpx center no-repeat;
					background-size: 32rpx;

					&.sp-pay__type-checked {
						background: url('@{cdn}register/checked.png') 600rpx center no-repeat;
						background-size: 32rpx;
					}

					&:not(:first-child) {
						border-top: 1rpx solid #eee;
					}

					image,
					text {
						display: block;
					}

					image {
						.square(38);
						margin-right: 16rpx;
					}

					text {
						.font(30, 42, #222, left);
					}
				}
			}
		}
	}
}
